﻿<%@ Page Language="c#" Inherits="WinnerCMS.WebUI.Admin.Login" CodeBehind="Login.aspx.cs" %>

<!doctype html>
<html class="app">
<head>
    <title>管理员登陆</title>
    <meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
    <meta charset="utf-8">
    <meta http-equiv="Pragma" content="No-cach" />
    <link href="../Content/bootstrap.min.css" rel="stylesheet" />
    <link href="../Content/bootstrap-theme.min.css" rel="stylesheet" />
    <link href="../Content/font-awesome.min.css" rel="stylesheet" />
    <link href="/Content/iCheck/flat/flat.css" rel="stylesheet"/>
    <%: Scripts.Render("~/Scripts/AdminBase") %>
    <script type="text/javascript">

        $(document).ready(function () {
            $(".checkbox").iCheck({
                checkboxClass: 'icheckbox_flat',
                radioClass: 'iradio_flat'
            });
            $("Form").validate();
            $("#txtUserName,#txtPassword").focus(PassCodeShow);

            $("#PassCode").click(function () {
                this.src = "../PassCode.ashx?Action=AdminLogin&n=" + Math.random();
            });

            $(document).keydown(function (e) {
                var curKey = e.which;
                if (curKey === 13) {
                    $("#btnLogin").click();
                    return false;
                }
                return true;
            });

        });
        var PassCodeShow = function () {
            if ($("#PassCodeLoading").is(":hidden") && $("#PassCode").is(":hidden") === false) {
                return;
            }
            $(".ValidateCode").show();

            var pimg = $("#PassCode");
            pimg.bind("load", function () {
                pimg.show();
                $("#PassCodeLoading").hide();
            });
            pimg.hide().attr("src", "../PassCode.ashx?Action=AdminLogin");

            
        };
        var PassCodeCheck = function () {
            if ($(".ValidateCode")) {
                if ($(".ValidateCode").is(":hidden") || $("#NtxtValidateCode").val() === "") {
                    PassCodeShow();
                    alert("请输入验证码。");
                    return false;
                }
            }
            return true;
        };
    </script>
 
    <style>
        html {
            background-color: #a9a9a9;
            overflow-x: hidden;
        }
        body {
            background-color: transparent;
            color: #585858;
            font-family: "Microsoft YaHei", "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
            font-size: 14px;
            line-height: 1.42857;
        }
        :focus {
            outline: 0 none !important;
        }
        a {
            color: #181a1c;
            text-decoration: none;
        }
            a:hover, a:focus {
                color: #3c4144;
                text-decoration: none;
            }
        label {
            font-weight: normal;
        }
        small, .small {
            font-size: 12px;
        }
        a:hover {
            border-top-color: #fff;
        }
        .form-control {
            border-color: #cbd5dd;
            border-radius: 2px;
        }
            .form-control, .form-control:focus {
                -webkit-box-shadow: none;
                -ms-box-shadow: none;
                box-shadow: none;
            }
                .form-control:focus {
                    border-color: #177bbb;
                }
        .input-group-addon {
            background-color: #fcfcfd;
            border-color: #cbd5dd;
        }
        body.container {
            padding: 0;
        }
        @media (min-width: 768px) {
            body.container {
                border-left: 1px solid #cbd5dd;
                border-right: 1px solid #cbd5dd;
                box-shadow: 0 3px 60px rgba(0, 0, 0, 0.3);
            }
            .app, .app body {
                height: 100%;
                overflow: hidden;
            }
            .aside-xl {
                width: 360px;
            }
        }
        .input-append.date .add-on i, .input-prepend.date .add-on i {
            cursor: pointer;
            display: block;
            height: 16px;
            width: 16px;
        }
        .bg-white-only {
            background-color: #fff;
        }
        div.line {
            font-size: 0;
            height: 2px;
            margin: 10px 0;
            overflow: hidden;
        }
        .no-border, .no-borders {
            border-color: transparent;
            border-width: 0;
        }
        .text-xxl {
            font-size: 24px;
        }
        .active > .text-active, .active > .auto .text-active {
            display: inline-block !important;
        }.wrapper {
            padding: 15px;
        }
        .wrapper-md {
            padding: 20px;
        }
        .m-t-lg {
            margin-top: 30px;
        }
        .m-b-lg {
            margin-bottom: 30px;
        }
        .bg-f7f7f7 {
            background-color: #f7f7f7;
        }
        #floater {
            height: 50%;
            margin-bottom: -280px;
            position: relative;
        }
        .checkbox label {
            font-size: 12px;
            font-weight: 500;
        }
        .checkbox small a {
            color: #137aaf;
            font-size: 13px;
            text-decoration: underline;
        }
            .checkbox small a:hover {
                color: #137aaf;
                font-size: 13px;
                text-decoration: none;
            }
        .bg-signin {
            background-color: #fff;
            border-radius: 30px;
            box-shadow: 2px 2px 15px;
            padding: 30px 30px 0;
        }

        .sigin-input {
            background-color: #f7f7f7;
            margin-bottom: 15px;
            padding: 5px 15px;
        }
        .ValidateCode {
            display: none;
        }
        .ValidateCode img {
            cursor: pointer;
            float: right;
            height: 34px;
            top: 5px;
            width: 80px;
        }
         .ValidateCode input {
    width: 200px;
}
    </style>
</head>
<body class="bg-white-only">
    <section style="height: 90%" class="wrapper-md animated fadeInUp" id="content">
        <div id="floater"></div>
        <div class="container aside-xl bg-signin">

            <section class="m-b-lg">
                <header class="wrapper text-center">
                    <strong class="text-xxl">WinnerCMS V7</strong><br>
                </header>
                <form method="post" runat="server">

                    <div class="list-group">
                        <div class="list-group-item sigin-input">
                            <BootStrap:TextBox ID="txtUserName" runat="server" Placeholder="用户名" CssClass="form-control no-border bg-f7f7f7" data-val-required="用户名 字段是必需的。" data-val="true"></BootStrap:TextBox>
                            <span style="color: #C5C5C5; top: 5px;" class="glyphicon glyphicon-user form-control-feedback"></span>
                        </div>
                        <div class="list-group-item sigin-input">
                            <BootStrap:TextBox ID="txtPassword" runat="server" Placeholder="密码" data-val-required="密码 字段是必需的。" data-val="true" CssClass="form-control no-border bg-f7f7f7" TextMode="Password"></BootStrap:TextBox>
                            <span style="color: #C5C5C5; top: 5px;" class="glyphicon glyphicon-lock form-control-feedback"></span>
                        </div>
                        <div class="list-group-item sigin-input ValidateCode">
                            <BootStrap:TextBox ID="txtValidateCode" runat="server" Placeholder="验证码" CssClass="form-control no-border bg-f7f7f7"></BootStrap:TextBox>
                            <img title="看不清楚，点击刷新。" id="PassCode" alt="" class="form-control-feedback" style="pointer-events: all;" src="">
                        </div>
                    </div>
                    <BootStrap:Button ID="btnLogin" CssClass="btn-lg btn-block" runat="server" Text="登&#12288;&#12288;录"
                        OnClick="btnLogin_Click" Exterior="primary" ToDo="ClickOnce" data-loading-text="提交中"></BootStrap:Button>
                    <div class="checkbox m-t-lg">
                            <input type="checkbox" value="" name="RememberMe" id="RememberMe"><label for="RememberMe">记住密码</label>

                        <small class="pull-right">
                            <a href="/Account/ForgotPassword" class="auto" data-toggle="ajaxModal">忘记密码？</a>
                        </small>
                    </div>
                </form>
            </section>
        </div>
    </section>


</body>

</html>
